<template>
  <div class="message-content">
    <van-nav-bar title="查看客户" left-arrow @click-left="onClickLeft" />

    <!-- <van-row class="message-header">
      <van-col span="24">查看客户</van-col>
    </van-row>-->
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
        <div class="body-content">
          <van-swipe-cell v-for="(item, index) in items" :key="index" class="messageList-content">
            <van-cell center>
              <van-row>
                <van-col span="24">
                  <van-col span="24">{{item.name}}</van-col>
                  <van-col span="24">￥{{item.taxAmount}}</van-col>
                </van-col>
              </van-row>
            </van-cell>
          </van-swipe-cell>
        </div>
      </van-list>
    </van-pull-refresh>
  </div>
</template>

<script>
import { queryMessage, setMessage, setAllMessage } from "@/api/message/message";
import { clearArr } from "@/api/public/public";
import { findMoneyByCustomer } from "@/api/main/main";
import { Toast } from "vant";
export default {
  data() {
    return {
      // 条件搜素
      value: "",
      endTime: "",
      startTime: "",
      idclerk: "",
      status: "",
      // 消息
      items: [],
      // 下拉翻页
      page: 1,
      limit: 10,
      // 未读消息数量
      num: 0,
      numMessage: "",
      count: "", //总数
      loading: false,
      finished: false,
      refreshing: false,
    };
  },
  created() {
    this.idclerk = this.$route.query.idclerk;
    this.startTime = this.$route.query.startTime;
    this.endTime = this.$route.query.endTime;
    this.status = this.$route.query.status;
    console.log("loading", this.loading);
    console.log("finished", this.finished);
    console.log("refreshing", this.refreshing);

    // this.findMessage();
    // this.onRefresh();
  },
  methods: {
    // 下拉刷新事件
    onLoad() {
      this.findMessage();
    },
    onRefresh() {
      // 清空列表数据
      this.finished = false;
      this.page = 1;
      this.num = 0;
      this.numMessage = `当前还有${this.num}条消息未读！`;
      this.items = [];
      // 重新加载数据
      // 将 loading 设置为 true，表示处于加载状态
      this.loading = true;
      this.onLoad();
    },
    // 全部已读
    onAllRead() {
      // 获取账套和用户信息
      // let user = this.$session.get("user");
      let person = this.$session.get("person");
      let Account = this.$session.get("Account");
      let condition = {
        datasource: JSON.parse(Account),
        userID: JSON.parse(person).personId,
      };
      setAllMessage(condition, (data) => {
        data.success === true &&
          ((this.value = ""), this.onRefresh(), Toast("全部消息已读！"));
      });
    },
    // 条件搜索
    onQueryMessage() {
      this.page = 1;
      this.items = [];
      this.findMessage();
    },
    // 消息已读；
    onSetMessage(id) {
      let condition = id;
      setMessage(condition, (data) => {
        if (data.success === true) {
          // 刷新
          //   this.page = 1;
          //   this.items = [];
          //   this.onRefresh();
          this.items.map((ele) => {
            ele.id === id && (ele.viewStatus = 1);
          });
          this.num--;
          this.numMessage = `当前还有${this.num}条消息未读！`;

          // this.findMessage();
        }
      });
    },
    findMessage() {
      console.log("findMessage");
      // 获取账套下的数据库
      let DsName = this.$session.get("DsName");
      let user = JSON.parse(this.$session.get("user"));

      let condition = {
        DsName: JSON.parse(DsName),
        startTime: this.startTime,
        endTime: this.endTime,
        idclerk: this.idclerk,
        page: this.page++,
        limit: this.limit,
        status: this.status,
        appBs: user.appBs,
      };
      findMoneyByCustomer(condition, (data) => {
        let items = data.data;
        // 总数
        this.count = data.count;
        console.log("count", this.count);
        items.forEach((ele) => {
          this.items.push(ele);
        });
        // 去重
        // this.items = clearArr(this.items);
        //   // 加载状态结束
        this.loading = false;
        this.refreshing = false;
        // 数据全部加载完成
        if (this.items.length >= this.count) {
          this.finished = true;
        }
      });
    },
    // 返回事件
    onClickLeft() {
      this.$router.go(-1);
    },
  },
};
</script>

<style lang="scss" scoped>
.message-content {
  .message-header {
    height: 60px;
    width: 100%;
    color: white;
    // background-color: white;
    background-color: #1989fa;
    line-height: 60px;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 1;
  }
  .body-content {
    // margin-top: 60px;
    // margin-bottom: 60px;
    .messageList-content {
      .van-button--square {
        border-radius: 0;
        height: 100% !important;
      }
    }
  }
}
</style>
